import 'package:cook_dinner/config/include.dart';
import 'package:cook_dinner/pages/menu_dan/menu_dan.dart';
import 'package:cook_dinner/pages/sort/sort.dart';
import 'package:cook_dinner/pages/step/step.dart';
import 'package:flutter/material.dart';

class HomeCook extends StatelessWidget {
  const HomeCook({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Transform.translate(
      offset: Offset(0, -20.rpx),
      child: Padding(
        padding: EdgeInsets.only(left: 22.rpx, right: 22.rpx),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            InkWell(
              onTap: () => AppTo.goto(context, AppPage.menu),
              child: Container(
                width: 171.rpx,
                height: 132.rpx,
                decoration: _boxStyle(),
                padding: EdgeInsets.only(top: 12.rpx, left: 16.rpx),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      '每日菜谱',
                      style: TextStyle(
                          fontSize: 16.rpx,
                          color: const Color(0xfffa8f0a),
                          fontWeight: FontWeight.w600),
                    ),
                    SizedBox(height: 2.rpx),
                    Text(
                      '教你三餐都不重复',
                      style: TextStyle(
                        fontSize: 11.rpx,
                        color: const Color(0xffcccccc),
                      ),
                    ),
                    Align(
                      alignment: Alignment.center,
                      child: Padding(
                        padding: EdgeInsets.only(right: 16.rpx),
                        child: Image.asset(
                          'assets/images/cai01.png',
                          width: 118.rpx,
                          height: 76.rpx,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            Column(
              children: [
                InkWell(
                  onTap: () => AppTo.goto(context, AppPage.sort),
                  child: Container(
                    width: 198.rpx,
                    height: 62.rpx,
                    decoration: _boxStyle(),
                    padding: EdgeInsets.only(left: 16.rpx, right: 16.rpx),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Text(
                              '分类',
                              style: TextStyle(
                                  fontSize: 16.rpx,
                                  color: const Color(0xff000000),
                                  fontWeight: FontWeight.w600),
                            ),
                            SizedBox(height: 2.rpx),
                            Text(
                              '各种类型任你挑选',
                              style: TextStyle(
                                fontSize: 11.rpx,
                                color: const Color(0xffcccccc),
                              ),
                            ),
                          ],
                        ),
                        Padding(
                          padding: EdgeInsets.only(bottom: 0.rpx),
                          child: Image.asset(
                            'assets/images/cai02.png',
                            width: 50.rpx,
                            height: 50.rpx,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                SizedBox(height: 10.rpx),
                Container(
                  width: 198.rpx,
                  height: 62.rpx,
                  decoration: _boxStyle(),
                  padding: EdgeInsets.only(left: 16.rpx, right: 16.rpx),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            '商店',
                            style: TextStyle(
                                fontSize: 16.rpx,
                                color: const Color(0xff000000),
                                fontWeight: FontWeight.w600),
                          ),
                          SizedBox(height: 2.rpx),
                          Text(
                            '各种食材应有尽有',
                            style: TextStyle(
                              fontSize: 11.rpx,
                              color: const Color(0xffcccccc),
                            ),
                          ),
                        ],
                      ),
                      Padding(
                        padding: EdgeInsets.only(bottom: 0.rpx),
                        child: Image.asset(
                          'assets/images/cai03.png',
                          width: 54.rpx,
                          height: 54.rpx,
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Decoration _boxStyle() {
    return BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.circular(6.rpx),
      boxShadow: [
        BoxShadow(
          offset: Offset(0, 2.rpx), // 垂直偏移4px，水平偏移0
          blurRadius: 4.rpx, // 模糊半径20px
          spreadRadius: 0, // 扩展半径0，保持阴影大小不变
          color: const Color(0xFF000000).withOpacity(0.05), // 颜色设置为透明度较低的黑色
        ),
      ],
    );
  }
}
